<template>
  <div class="wrap">
    <div class="header">
      <div class="line-block">
        <div class="left">
          <div class="search">
            <div>
              <el-radio-group v-model="queryParams.tabType" size="medium" @change="search();">
                <el-radio-button :disabled="loading" :label="1">{{ getWareHouseName() }}</el-radio-button>
                <el-radio-button :disabled="loading" :label="2" v-if="$store.getters.accountMKD">{{$t('shipment.mercadoFull')}}</el-radio-button>
                <el-radio-button :disabled="loading" :label="3" v-if="$store.getters.accountFalabella">{{$t('shipment.falabellaFull')}}</el-radio-button>
                <el-radio-button :disabled="loading" :label="4" v-if="$store.getters.accountShopee">{{$t('shipment.shopeeFull')}}</el-radio-button>
                <el-radio-button :disabled="loading" :label="5" v-if="$store.getters.accountShein">{{$t('shipment.sheinFull')}}</el-radio-button>
                <el-radio-button :disabled="loading" :label="6" v-if="$store.getters.accountAmazon">{{$t('shipment.amazonFull')}}</el-radio-button>
                <el-radio-button :disabled="loading" :label="7" v-if="$store.getters.accountTikTok">{{$t('shipment.tiktokFull')}}</el-radio-button>
                <el-radio-button :disabled="loading" :label="10" v-if="$store.getters.accountAliexpress">{{$t('shipment.aliexpressFull')}}</el-radio-button>
                <!--<el-radio-button :label="7" >{{$t('shipment.packetStock')}}</el-radio-button>-->
              </el-radio-group>
            </div>

            <div style="margin-top: 10px">
              <div style="display: inline-block;" class="mgr20">
                <el-select v-model="queryParams.platformType" size="small" style="margin-left: 0" @change="search();queryParams.accountId = ''">
                  <el-option :label="$t('shipment.allPlatforms')" value=""></el-option>
                  <el-option :label="getMercadoName()" :value="1" v-if="$store.getters.accountMKD"></el-option>
                  <el-option :label="getFalabellaName()" :value="2" v-if="$store.getters.accountFalabella"></el-option>
                  <el-option :label="getShopeeName()" :value="3" v-if="$store.getters.accountShopee"></el-option>
                  <el-option :label="getSheinName()" :value="4" v-if="$store.getters.accountShein"></el-option>
                  <el-option :label="getAmazonName()" :value="5" v-if="$store.getters.accountAmazon"></el-option>
                  <el-option :label="getTikTokName()" :value="6" v-if="$store.getters.accountTikTok"></el-option>
                  <el-option :label="getAliexpressName()" :value="8" v-if="$store.getters.accountAliexpress"></el-option>
                  <el-option :label="$t('shipment.packetStockV2')" :value="7"></el-option>
                </el-select>
              </div>

              <div style="display: inline-block;" class="mgr20">
                <el-select v-model="queryParams.accountId" size="small" style="margin-left: 0" @change="search">
                  <el-option :label="'全部店铺'" value=""></el-option>
                  <el-option v-for="(item, index) in selectAccountList" :key="index" :value="item.id" :label="item.name"></el-option>
                </el-select>
              </div>

              <div style="display: inline-block;"  v-if="queryParams.tabType === 1">
                <el-select v-model="queryParams.isCombinationGoods" size="small" style="margin-left: 0" @change="search" clearable class="mgr20">
                  <el-option :label="'全部商品类型'" value=""></el-option>
                  <el-option :label="'单商品'" :value='1'></el-option>
                  <el-option :label="'组合商品'" :value='2'></el-option>
                </el-select>

                <el-select v-model="queryParams.haveStock" size="small" style="margin-left: 0" @change="search" clearable class="mgr20">
                  <el-option :label="'全部库存商品'" value=""></el-option>
                  <el-option :label="'有库存商品'" :value='1'></el-option>
                  <el-option :label="'无库存商品'" :value='0'></el-option>
                </el-select>

                <el-select v-model="queryParams.isPackageMaterial" size="small" style="margin-left: 0" class="mgr20" clearable @change="search" >
                  <el-option :label="$t('order.allPackagingServices')" value=""></el-option>
                  <el-option :label="$t('table.No packaging service')" :value='0'></el-option>
                  <el-option
                    v-for="(item, index) in packageMaterial"
                    :key="index"
                    :label="item.name + '(' + item.price + $t('table.unit1') + ')'"
                    :value="item.id">
                  </el-option>
                </el-select>

              </div>



              <div style="display: inline-block;" class="mgr20">

                <div style="display: inline-block" class="mgr20 mgb10" v-if="$store.getters.accountMKD">{{ $t('平台前台库存',{platform: getMercadoName()}) }}：
                  <el-button :type="this.queryParams.inventoryTips === 1 ? 'danger' : ''"   @click="changeButton('inventory')" :disabled="loading">{{$t('低于',{num: inventoryTipsNum})}}</el-button>
                </div>

                <div style="display: inline-block" class="mgr20 mgb10" v-if="$store.getters.accountFalabella">{{ $t('平台前台库存',{platform: getFalabellaName()}) }}：
                  <el-button :type="this.queryParams.faInventoryTips === 1 ? 'danger' : ''"   @click="changeButton('faInventory')" :disabled="loading">{{$t('低于',{num: faInventoryTipsNum})}}</el-button>
                </div>

                <div style="display: inline-block" class="mgr20 mgb10" v-if="$store.getters.accountShopee">{{ $t('平台前台库存',{platform: getShopeeName()}) }}：
                  <el-button :type="this.queryParams.spInventoryTips === 1 ? 'danger' : ''"   @click="changeButton('spInventory')" :disabled="loading">{{$t('低于',{num: spInventoryTipsNum})}}</el-button>
                </div>

                <div style="display: inline-block" class="mgr20 mgb10" v-if="$store.getters.accountShein">{{ $t('平台前台库存',{platform: getSheinName()}) }}：
                  <el-button :type="this.queryParams.siInventoryTips === 1 ? 'danger' : ''"   @click="changeButton('siInventory')" :disabled="loading">{{$t('低于',{num: siInventoryTipsNum})}}</el-button>
                </div>

                <div style="display: inline-block" class="mgr20 mgb10" v-if="$store.getters.accountAmazon">{{ $t('平台前台库存',{platform: getAmazonName()}) }}：
                  <el-button :type="this.queryParams.awsInventoryTips === 1 ? 'danger' : ''"   @click="changeButton('awsInventory')" :disabled="loading">{{$t('低于',{num: awsInventoryTipsNum})}}</el-button>
                </div>

                <div style="display: inline-block" class="mgr20 mgb10" v-if="$store.getters.accountTikTok">{{ $t('平台前台库存',{platform: getTikTokName()}) }}：
                  <el-button :type="this.queryParams.tiktokInventoryTips === 1 ? 'danger' : ''"   @click="changeButton('tiktokInventory')" :disabled="loading">{{$t('低于',{num: tiktokInventoryTipsNum})}}</el-button>
                </div>

                <div style="display: inline-block" class="mgr20 mgb10" v-if="$store.getters.accountAliexpress">{{ $t('平台前台库存',{platform: getAliexpressName()}) }}：
                  <el-button :type="this.queryParams.aliexpressInventoryTips === 1 ? 'danger' : ''"   @click="changeButton('aliexpressInventory')" :disabled="loading">{{$t('低于',{num: aliexpressInventoryTipsNum})}}</el-button>
                </div>

                <div style="display: inline-block" class="mgr20 mgb10">{{$t('代发库存')}}：
                  <el-button :type="this.queryParams.stockTips === 1 ? 'danger' : ''" @click="changeButton('stock')" :disabled="loading">{{$t('低于',{num: stockTipsNum})}}</el-button>
                </div>
              </div>
            </div>

            <div>
              <div style="display: inline-block;margin-right: 10px;">
                <el-input size="small" style="width: 200px; margin-right: 10px;" v-model="queryParams.keyword" :placeholder="$t('common.searchForCompleteListingIDorSKU')"></el-input>
                <el-button size="small" type="primary" @click="search()">{{ $t('common.search') }}</el-button>
              </div>

              <batch-goods-attr style="display: inline"></batch-goods-attr>

              <custom-fields-dialog
                class="mgl10"
                :default-fields-config="defaultFieldsConfig"
                :initUserSelectedFields="userSelectedFields"
                @submit="submitTableField"
              ></custom-fields-dialog>

              <export-button :func="stockList" :query-params="queryParams" :exportType="'user_stock_list'" :getTotal="total"></export-button>

              <div style="display: inline-block;" class="mgb10 mgt10 mgr10" v-if="$store.getters.accountShein">
                <el-button :disabled="loading" type="info" @click="syncSheinGoods">同步SHEIN商品</el-button>

              </div>
              <div style="display: inline-block;" class="mgb10 mgt10">
                <el-button type="warning" size="small" v-if="$store.getters.roleType!=ROLE_FINANCE()"  @click="$router.push({name: 'createPacketGoods'})">上传小包商品</el-button>
              </div>
            </div>
          </div>
        </div>
        <div class="right">
        </div>
      </div>
    </div>

    <!--物流商仓库-->
    <div class="content" v-show="queryParams.tabType === 1">
      <el-table
        v-loading="loading"
        :data="data"
        border
        @sort-change="handleSortChange"
        :key="refreshTableKey"
        v-tableHeightV2="{ bottomOffset: -60, additionalSelectors: ['.header', '.table-tips', '.page-wrap'] }"
        height="100px"
        ref="tableDataOne"
      >
        <el-table-column
          prop="image"
          :label="$t('table.productCover')"
          align="center"
          width="110"
          fixed="left"
        >
          <template slot-scope="{row}">
            <div class="img-box img-one">
              <img :src="row.image" alt="">
              <template v-if="row.isCombinationGoods === 1">
                <el-tooltip class="item" effect="dark" placement="top-start">
                  <div slot="content" style="font-size: 14px;">
                    {{$t('table.组合商品')}}：
                    <p
                      v-for="(item, index) in row.combinationGoodsInfoData"
                      :key="index"
                    >
                      <template v-if="item.num > 0">
                        {{ item.sku }} * {{ item.num }}
                      </template>
                    </p>
                  </div>
                  <el-tag
                    type="success"
                    effect="light"
                    class="order-status-tag img-tag"
                  >
                    {{$t('table.组合')}}
                  </el-tag>
                </el-tooltip>
              </template>
            </div>
          </template>
        </el-table-column>

        <el-table-column
          v-for="v in tableFieldsConfig"
          :key="v.prop"
          :prop="v.prop"
          :label="v.label"
          :align="v.align"
          :min-width="v.minWidth"
          :fixed="!!v.fixed"
          :show-overflow-tooltip="!!v.showOverflowTooltip"
          :sortable="v.sortable ? v.sortable : false"
        >
          <!--   表头   -->
          <template slot="header">

            <template v-if="v.prop === 'package'">
              <span>{{$t('table.Packaging Services')}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>{{$t('table.Packaging Tis One')}}<br/>{{$t('table.Packaging Tis Two')}}<br/>{{$t('table.Packaging Tis Three')}}</template>
                <i class="el-icon-question" style="color:#409eff; margin-left:5px;"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'stockNum'">
              <span>{{v.label}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>
                  <div>
                    仓库已接收分拣并已清点上架的一件代发库存，可开始销售，可调拨到暂存中转后送官方仓
                  </div>
                  <br>
                  <div>
                    <div>Listing ID （SKU）行对应库存表示商品已贴对应的官方产品标（MLCode）</div>
                    <div>系统标（SKU）行对应库存表示商品已贴系统生成的产品标</div>
                    <div>未贴标行对应库存表示商品尚未贴产品标</div>
                  </div>
                  <br>
                  <div>
                    如果为库存负数，一般因接入前期未及时在本系统中添加对应商品的库存（货件）导致的
                    <br>
                    请与运营（仓库）人员联系核对调整
                  </div>

                </template>
                <i class="el-icon-question table-question-icon"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'stockNumSorted'">
              <span>{{v.label}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>
                  <div>
                    仓库已接收分拣但还未清点上架的一件代发库存，不可销售，不可调拨到暂存中转或送官方仓
                  </div>
                  <br>
                  <div>
                    <div>Listing ID （SKU）行对应库存表示商品已贴对应的官方产品标（MLCode）</div>
                    <div>系统标（SKU）行对应库存表示商品已贴系统生成的产品标</div>
                    <div>未贴标行对应库存表示商品尚未贴产品标</div>
                  </div>
                </template>
                <i class="el-icon-question table-question-icon"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'middleStockNum'">
              <span>{{v.label}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>
                  <div>
                    仓库已接收分拣并清点上架的暂存中转库存，不可销售，可调拨到一件代发或送官方仓
                  </div>
                  <br>
                  <div>
                    <div>Listing ID （SKU）行对应库存表示商品已贴对应的官方产品标（MLCode）</div>
                    <div>系统标（SKU）行对应库存表示商品已贴系统生成的产品标</div>
                    <div>未贴标行对应库存表示商品尚未贴产品标</div>
                  </div>
                </template>
                <i class="el-icon-question table-question-icon"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'middleStockNumSorted'">
              <span>{{v.label}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>
                  <div>
                    仓库已接收分拣但还未清点上架的暂存中转库存，不可销售，不可调拨到一件代发或送官方仓
                  </div>
                  <br>
                  <div>
                    <div>Listing ID （SKU）行对应库存表示商品已贴对应的官方产品标（MLCode）</div>
                    <div>系统标（SKU）行对应库存表示商品已贴系统生成的产品标</div>
                    <div>未贴标行对应库存表示商品尚未贴产品标</div>
                  </div>
                </template>
                <i class="el-icon-question table-question-icon"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'fullStockNum'">
              <span>{{v.label}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>
                  <div>
                    仓库已接收分拣，等待出库的官方仓直送、线下配送类型货件和送仓工单的商品库存数量，不可销售
                  </div>
                  <br>
                  <div>
                    <div>Listing ID （SKU）行对应库存表示商品已贴对应的官方产品标（MLCode）</div>
                    <div>系统标（SKU）行对应库存表示商品已贴系统生成的产品标</div>
                    <div>未贴标行对应库存表示商品尚未贴产品标</div>
                  </div>
                </template>
                <i class="el-icon-question table-question-icon"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'totalStockNum'">
              <span >{{$t('table.仓库总库存',{warehouseName: getWareHouseName()})}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>总库存=代发库存（已上架）+ 代发库存（待上架）+ 暂存中转（已上架）+ 暂存中转（待上架）+ 待送仓库存</template>
                <i class="el-icon-question table-question-icon"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'underWayNum'">
              <span>{{v.label}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>海外仓还未分拣入仓的头程、移仓、退仓货件商品数量</template>
                <i class="el-icon-question table-question-icon"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'goodsValue'">
              <span>{{v.label}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>{{$t('table.单个商品的货物申报价值')}}</template>
                <i class="el-icon-question" style="color:#409eff; margin-left:5px;"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'price'">
              <span>{{$t('售价')}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>{{ $t('商品有折扣价时显示折扣价，无折扣价时显示为原价') }}</template>
                <i class="el-icon-question font-blue" style="margin-left: 5px"></i>
              </el-tooltip>
            </template>

            <template v-else-if="v.prop === 'combinationGoodsStockNum'">
              <span>{{$t('table.组合库存')}}</span>
              <el-tooltip class="item" effect="dark" placement="top">
                <template #content>组合库存根据子商品的组合数量和一件代发库存自动计算，取最低值</template>
                <i class="el-icon-question font-blue" style="margin-left: 5px"></i>
              </el-tooltip>
            </template>

            <template v-else>{{v.label}}</template>
          </template>

          <template v-slot="{row}">
            <template v-if="v.prop === 'title'">
              <el-tooltip class="item" effect="dark" :content="row.title" placement="top">
                <div class="hidden-2">
                  {{row.title}}
                </div>
              </el-tooltip>
              <div class="goods-SKU-info">
                <span
                  v-for="attr in row.attributes"
                  :key="attr.name"
                  class="attr"
                >
                  {{attr.name}} : {{attr.value}}
                  <span class="attr-link"> | </span>
                </span>
              </div>
            </template>

            <template v-else-if="v.prop === 'goodsList'">
              <div
                v-for="item in row.goodsList"
                :key="item.id"
              >
                <template v-if="item.isTB">
                  {{$t('shipment.Not labeled')}}
                </template>
                <template v-else-if="item.isSystemLabel">
                  {{$t('shipment.System label')}} ({{item.sku}})
                </template>
                <template v-else>
                  {{item.goodsId}} {{item.sku ? `(${item.sku})` : ''}}
                </template>
              </div>
            </template>

            <template v-else-if="v.prop === 'price'">
              <template v-if="row.isPacket">
                -
              </template>
              <template v-else>
                <div
                  v-for="goods in row.goodsList"
                  :key="goods.id"
                >
                  <template v-if="goods.price">
                    {{goods.currencyId}}  {{goods.price}}
                  </template>
                  <template v-else>
                    -
                  </template>
                </div>
              </template>
            </template>

            <template v-else-if="v.prop === 'inventoryId'">
              <template v-if="row.isPacket">
                 {{row.sku}}
              </template>
              <template v-else>
                <div
                  v-for="item in row.goodsList"
                  :key="item.id"
                >
                  <template v-if="item.isTB">
                    {{$t('shipment.Not labeled')}}
                  </template>
                  <template v-else-if="item.isSystemLabel">
                    {{item.sku}}
                  </template>
                  <template v-else>
                    {{item.inventoryId || '-'}}
                  </template>
                </div>
              </template>

            </template>

            <template v-else-if="v.prop === 'weight'">
              <goods-size-v2
                :suit-id="row.suitId"
                :goods-row="row"
              >
              </goods-size-v2>
            </template>

            <template v-else-if="v.prop === 'accountType'">
              <template v-if="row.isPacket">
                小包
              </template>
              <template v-else>
                <div
                  v-for="item in row.goodsList"
                  :key="item.id"
                  :class="getPlatformTextColor(item.accountType)"
                >
                  <template v-if="!item.isGoods">
                    -
                  </template>
                  <template v-else>
                    {{getPlatformShortNameByAccountNum(item.accountTypeNum)}}({{item.showName}})
                  </template>
                </div>
              </template>
            </template>

            <template v-else-if="v.prop === 'package'">
              <el-select v-model="row.packageMaterialId" @change="savePackageMaterialId(row)">
                <el-option :label="$t('table.No packaging service')" :value='0'></el-option>
                <el-option
                  v-for="(item, index) in packageMaterial"
                  :key="index"
                  :label="item.name + '(' + item.price + $t('table.unit1') + ')'"
                  :value="item.id">
                </el-option>
              </el-select>
            </template>

            <template v-else-if="v.prop === 'status'">
              <template v-if="row.isPacket">
                -
              </template>
              <template v-else>
                <div
                  v-for="item in row.goodsList"
                  :key="item.id"
                >
                  {{item.status}}
                  <span v-if="item.catalogListing">，Catalog</span>
                  <full-span :row="item"></full-span>
                  <flex-span :row="item"></flex-span>
                </div>
              </template>
            </template>

            <template v-else-if="v.prop === 'inventory'">
              <template v-if="row.isPacket">
                -
              </template>
              <template v-else>
                <div
                  v-for="item in row.goodsList"
                  :key="item.id"
                  :class="inventoryTipsClass(item)"
                >
                  <template v-if="item.flexInventory !== null && item.flexInventory >= 0">
                    FULL: {{item.inventory}}，Flex: {{item.flexInventory}}
                  </template>
                  <template v-else>
                    {{item.inventory}}
                  </template>
                </div>
              </template>
            </template>

            <template v-else-if="v.prop === 'stockNum'">
              <div
                v-for="item in row.goodsList"
                :key="item.id"
                :class="{'font-red': row.stockNum < stockTipsNum}"
              >
                <template v-if="item.isTB">-</template>
                <template v-else>
                  {{item.sumStockNum}}
                </template>
              </div>
            </template>

            <template v-else-if="v.prop === 'stockNumSorted'">
              <div
                v-for="goods in row.goodsList"
                :key="goods.id"
              >
                {{goods.stockNumSorted}}
              </div>
            </template>

            <template v-else-if="v.prop === 'middleStockNum'">
              <div
                v-for="goods in row.goodsList"
                :key="goods.id"
              >
                <template v-if="goods.isSystemLabel">-</template>
                <template v-else>
                  {{goods.sumMiddleStockNum}}
                </template>
              </div>
            </template>


            <template v-else-if="v.prop === 'middleStockNumSorted'">
              <div
                v-for="goods in row.goodsList"
                :key="goods.id"
              >
                <template v-if="goods.isSystemLabel">-</template>
                <template v-else>
                  {{goods.middleStockNumSorted}}
                </template>
              </div>
            </template>

            <template v-else-if="v.prop === 'fullStockNum'">
              <div
                v-for="goods in row.goodsList"
                :key="goods.id"
              >
                {{goods.sumFullStockNum}}
              </div>
            </template>

            <template v-else-if="v.prop === 'goodsValue'">
              <goods-value-column-v2 :show-message="true" :row="row"></goods-value-column-v2>
            </template>

            <template v-else-if="v.prop === 'isCombination'">
              <el-switch
                v-model="row.isCombination"
                @change="changeCombination(row)"
              >
              </el-switch>
            </template>

            <template v-else-if="v.prop === 'goodsNameZh'">
              {{row.goodsAttr ? row.goodsAttr.goodsNameZh : '-'}}
            </template>
            <template v-else-if="v.prop === 'goodsName'">
              {{row.goodsAttr ? row.goodsAttr.goodsName : '-'}}
            </template>
            <template v-else-if="v.prop === 'material'">
              {{row.goodsAttr ? row.goodsAttr.material : '-'}}
            </template>
            <template v-else-if="v.prop === 'application'">
              {{row.goodsAttr ? row.goodsAttr.application : '-'}}
            </template>


            <template v-else>
              {{ row[v.prop] }}
            </template>
          </template>

        </el-table-column>


        <el-table-column
          prop="op"
          :label="$t('table.operate')"
          align="left"
          min-width="400"
          fixed="right"
        >
          <template slot-scope="{row}">
            <div>
              <el-button type="primary" @click="jumpStockInfo(row)">库存明细</el-button>
              <stock-log-dialog style="display: inline" :suit-id="row.id" class="mgl10 mgb10"></stock-log-dialog>
              <el-popover
                placement="top"
                trigger="hover"
              >
                <template #reference>
                  <el-button type="info" class="mgl10 mgb10">更多操作</el-button>
                </template>
                <template #default>
                  <div class="btn-more-box">
                    <div class="btn-item" v-if="row.isPacket">
                      <el-button type="primary" @click="gotoEditPacketGoods(row)">{{ $t('packet.编辑商品') }}</el-button>
                    </div>
                    <div class="btn-item">
                      <el-button @click="suitGoods(row)" type="danger" v-if="$store.getters.roleType!=ROLE_FINANCE()">{{ $t('stock.Edit applicable SKU') }}</el-button>
                    </div>
                    <div class="btn-item">
                      <print-sku-info :data="row"></print-sku-info>
                    </div>
                    <div class="btn-item"   v-if="!row.isPacket">
                      <edit-goods-attr :goods="row" :package-material="packageMaterial" style="display: inline-block" @changeGoods="getData"></edit-goods-attr>
                    </div>
                    <div class="btn-item">
                      <el-button @click="showLabelPdfDialog(row)" type="primary" >{{ $t('stock.上传官方SKU标') }}</el-button>
                    </div>
                    <div class="btn-item">
                      <combination-goods
                        style="display: inline"
                        :suit-id="row.id"
                        class="mgl10 mgb10"
                        v-if="isOpenCombinationGoods === 1 && !row.isPacket"
                        @submitForm="search"
                      ></combination-goods>
                    </div>
                  </div>

                </template>
              </el-popover>
            </div>



          </template>
        </el-table-column>
      </el-table>
      <div style="font-size: 13px;color: #AAAAAA" class="table-tips mgt10">
        <div>{{$t('table.Front desk inventory')}}：{{$t('stock.stockText5')}}</div>
        <div>{{$t('table.%s Inventory')}}：{{$t('stock.stockText6')}}</div>
      </div>
      <div class="page-wrap mgt10">
        <el-pagination
          background
          layout="total, prev, pager, next, jumper"
          :current-page.sync="queryParams.page"
          :page-size="queryParams.pageSize"
          :total="total"
          @current-change="getData"
        >
        </el-pagination>
      </div>
    </div>

    <!--其他官方仓-->
    <div class="content" v-show="queryParams.tabType !== 1 && queryParams.tabType !== 7">
      <el-table
        v-loading="loading"
        :data="fullData"
        border
        @sort-change="handleSortChange"
        v-tableHeightV2="{ bottomOffset: -60, additionalSelectors: ['.header', '.table-tips', '.page-wrap'] }"
        height="100px"
        ref="tableDataTwo"
      >
        <el-table-column
          prop="goodsImage"
          :label="$t('table.productCover')"
          align="center"
          width="110"
        >
          <template slot-scope="{row}">
            <div class="img-box img-one">
              <img :src="row.image" alt="">
            </div>
            <el-tag type="success" class="full-tag" v-if="row.isWarehouse === 0">FULL</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          prop="goodsTitle"
          :label="$t('table.title')"
          align="left"
          width="500"
          show-overflow-tooltip
        >
          <template slot-scope="{row}">

            <div class="title hidden-1">
              {{ row.title }}
            </div>
            <p class="goods-attr">
              <span
                v-for="attr in row.attributes"
                :key="attr.name"
                class="attr"
                style="color: #7F7F7F;"
              >
                {{attr.name}} : {{attr.value}}
                <span class="attr-link"> | </span>
              </span>
            </p>
          </template>
        </el-table-column>
        <el-table-column
          prop="goodsList"
          :label="$t('table.applicableListingID&SKU')"
          align="left"
          min-width="200"
        >
          <template slot-scope="{row}">
            <div
              v-for="goods in row.goodsList"
              :key="goods.id"
            >
              {{goods.goodsId}} {{goods.sku ? `(${goods.sku})` : ''}}
            </div>
          </template>
        </el-table-column>

        <el-table-column
          prop="price"
          :label="$t('售价')"
          align="left"
          width="120"
        >
          <template #header>
            <span>{{$t('售价')}}</span>
            <el-tooltip class="item" effect="dark" placement="top">
              <template #content>{{ $t('商品有折扣价时显示折扣价，无折扣价时显示为原价') }}</template>
              <i class="el-icon-question font-blue" style="margin-left: 5px"></i>
            </el-tooltip>
          </template>
          <template v-slot="{row}">
            <div
              v-for="goods in row.goodsList"
              :key="goods.id"
            >
              <template v-if="goods.price">
                {{goods.currencyId}}  {{goods.price}}
              </template>
              <template v-else>
                -
              </template>
            </div>
          </template>
        </el-table-column>

        <m-l-code-list-column></m-l-code-list-column>

        <el-table-column
          prop="accountType"
          :label="$t('table.store')"
          width="150"
          align="left"
          v-if="$store.getters.platformNum > 1"
        >
          <template slot-scope="{row}">
            <div
              v-for="item in row.goodsList"
              :key="item.id"
              :class="getPlatformTextColor(item.accountType)"
            >
              {{getPlatformShortNameByAccountNum(item.accountTypeNum)}}({{item.showName}})
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="inventory"
          :label="$t('table.Front desk inventory')"
          align="center"
          min-width="100"
          sortable="custom"
        >
          <template slot-scope="{row}">
            <div
              v-for="goods in row.goodsList"
              :key="goods.id"
              :class="inventoryTipsClass(goods)"
            >
              {{goods.inventory}}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="stockNum"
          :label="$t('table.%s Inventory')"
          align="center"
          min-width="100"
          sortable="custom"
        >
          <template slot-scope="{row}">
            <div
              :class="{'font-red': row.stockNum < stockTipsNum}"
            >
              {{row.stockNum}}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="underWayNum"
          :label="$t('table.In-transit inventory')"
          align="center"
          min-width="100"
        >
        </el-table-column>
        <el-table-column
          prop="sales"
          :label="$t('table.sold')"
          align="center"
          min-width="100"
          sortable="custom"
        >
          <template slot-scope="{row}">
            <div
              v-for="goods in row.goodsList"
              :key="goods.id"
            >
              {{goods.sales}}
            </div>
          </template>
        </el-table-column>
      </el-table>
      <div class="table-tips">
        <p>{{$t('table.In-transit inventory')}}：{{ $t('stock.stockText5') }}</p>
      </div>
      <div class="page-wrap mgt10">
        <el-pagination
          background
          layout="total, prev, pager, next, jumper"
          :current-page.sync="queryParams.page"
          :page-size="queryParams.pageSize"
          :total="total"
          @current-change="getData"
        >
        </el-pagination>
      </div>
    </div>

    <!--小包库存-->
    <div class="content" v-show="queryParams.tabType === 7">
      <packet-goods-table
        :table-data="fullData"
        :loading="loading"
        :package-material="packageMaterial"
        @savePackageMaterialId="savePackageMaterialId"
      ></packet-goods-table>
      <div class="page-wrap mgt10">
        <el-pagination
            background
            layout="total, prev, pager, next, jumper"
            :current-page.sync="queryParams.page"
            :page-size="queryParams.pageSize"
            :total="total"
            @current-change="getData"
        >
        </el-pagination>
      </div>
    </div>

    <el-dialog
      class="select-goods-dialog"
      :title="$t('stock.Add other applicable Listing IDs and SKUs')"
      :visible.sync="dialogSuit"
    >
      <div class="select-goods">
        {{ $t('stock.The currently selected product') }}
        <el-table
          ref="selectGoods"
          :data="selectGoods"
          :border="true"
          row-key="id"
          class="goods-table"
        >
          <el-table-column
            prop="image"
            :label="$t('table.productCover')"
            align="left"
            width="120"
          >
            <template slot-scope="{row}">
              <div>
                <img :src="row.image" alt="" width="70" style="margin-left: 20px">
                <div class="catalogo-tag" v-if="row.catalogListing">
                  CATÁLOGO
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="title"
            :label="$t('table.title')"
            align="left"
            min-width="250"
          >
            <template slot-scope="{row}">
              <el-tooltip class="item" effect="dark" :content="row.title" placement="top">
                <div class="hidden-2">
                  {{row.title}}
                </div>
              </el-tooltip>
              <!-- 如果是变体则直接显示对应的属性 -->
              <template v-if="row.attributes">
                <div class="goods-SKU-info">
                <span
                  v-for="attr in row.attributes"
                  :key="attr.name"
                  class="attr"
                >
                  {{attr.name}} : {{attr.value}}
                  <span class="attr-link"> | </span>
                </span>
                </div>
              </template>

            </template>
          </el-table-column>
          <el-table-column
            :label="$t('table.ListingIDAndSKU')"
            align="center"
            min-width="150"
          >
            <template slot-scope="{row}">
              <div>{{row.goodsId}} {{row.sku ? `(${row.sku})` : ''}}</div>
            </template>
          </el-table-column>
          <m-l-code-column></m-l-code-column>
          <el-table-column
            :label="$t('table.Listing Status')"
            align="center"
            min-width="150"
          >
            <template slot-scope="{row}">
              {{row.status}}
              <span v-if="row.catalogListing">，Catalog</span>
              <full-span :row="row"></full-span>
            </template>
          </el-table-column>
          <el-table-column
            :label="$t('table.store')"
            prop="accountType"
            align="center"
            width="150"
            v-if="$store.getters.platformNum > 1"
          >
            <template slot-scope="{row}">
              {{getPlatformShortNameByAccountNum(row.accountTypeNum)}}({{row.showName}})
            </template>
          </el-table-column>
          <el-table-column
            :label="$t('table.operate')"
            align="center"
            min-width="100"
          >
            <template slot-scope="{row}">
              <diy-link @click="removeSelect(row)" v-if="selectGoods.length > 1">{{ $t('common.remove') }}</diy-link>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <div style="color: #F59A23" class="mgt10">{{ $t('stock.stockText1') }}</div>
      <div style="color: #7F7F7F;font-size: 13px;margin-top: 5px">{{ $t('stock.stockText2') }}</div>

      <div style="margin: 10px 0;">
        <el-input size="small" style="width: 200px" v-model="suitParams.keyword" :placeholder="$t('common.searchForCompleteListingIDorSKU')"></el-input>
        <el-button size="small" type="primary" @click="getSuitData">{{ $t('common.search') }}</el-button>
      </div>
      <el-table
        ref="goodsTable"
        :data="suitData"
        :border="true"
        row-key="id"
        v-loading="goodsTableLoading"
        class="goods-table"
        default-expand-all
      >
        <el-table-column
          prop="image"
          :label="$t('table.productCover')"
          align="left"
          width="120"
        >
          <template slot-scope="{row}">
            <div>
              <img :src="row.image" alt="" width="70" style="margin-left: 20px">
              <div class="catalogo-tag" v-if="row.catalogListing">
                CATÁLOGO
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          prop="title"
          :label="$t('table.title')"
          align="left"
          min-width="250"
        >
          <template slot-scope="{row}">
            <!-- 如果是变体则直接显示对应的属性 -->
            <el-tooltip class="item" effect="dark" :content="row.title" placement="top">
                <div class="hidden-2">
                  {{row.title}}
                </div>
            </el-tooltip>
            <template v-if="row.attributes">
              <div class="goods-SKU-info">
                <span
                  v-for="attr in row.attributes"
                  :key="attr.name"
                  class="attr"
                >
                  {{attr.name}} : {{attr.value}}
                  <span class="attr-link"> | </span>
                </span>
              </div>
            </template>

          </template>
        </el-table-column>
        <el-table-column
          :label="$t('table.store')"
          prop="accountType"
          align="center"
          width="150"
          v-if="$store.getters.platformNum > 1"
        >
          <template slot-scope="{row}">
            {{getPlatformShortNameByAccountNum(row.accountTypeNum)}}({{row.showName}})
          </template>
        </el-table-column>
        <el-table-column
          :label="$t('table.ListingIDAndSKU')"
          align="center"
          min-width="150"
        >
          <template slot-scope="{row}">
            <div>{{row.goodsId}} {{row.sku ? `(${row.sku})` : ''}}</div>
          </template>
        </el-table-column>
        <m-l-code-column></m-l-code-column>
        <el-table-column
          :label="$t('table.Listing Status')"
          align="center"
          min-width="150"
        >
          <template slot-scope="{row}">
            {{row.status}}
            <span v-if="row.catalogListing">，Catalog</span>
            <full-span :row="row"></full-span>
          </template>
        </el-table-column>
        <el-table-column
          :label="$t('table.operate')"
          align="center"
          min-width="100"
        >
          <template slot-scope="{row}">
            <el-link :underline="false" @click="addSelectGoods(row)" :disabled="disAbleAdd(row)">{{$t('common.add')}}</el-link>
          </template>
        </el-table-column>
      </el-table>
      <div class="footer">
        <el-button @click="dialogSuit = false" size="small" class="mgb10">{{$t('common.cancel')}}</el-button>
        <el-button @click="confirmSuit" :loading="suitConfirmLoading" type="primary" class="mgb10">{{$t('common.confirm')}}</el-button>
      </div>
    </el-dialog>

    <el-dialog
      class="goods-num-box-dialog"
      :title="$t('stock.编辑箱装数')"
      :visible.sync="goodsNumBoxFormDialog"
      width="450px"
    >
      <div class="font-grey mgb20" style="margin-top: -20px">
        {{$t('stock.箱装数指一般情况下一个箱子可装当前SKU的个数，设置完成后您在添加货件时可直接填写箱数入库')}}
      </div>
      <div class="goods-num-box-form">

        <el-form
          ref="accountForm"
          :model="goodsNumBoxForm"
          label-width="100px"
        >
          <el-form-item
            :label="$t('table.goodsNumBox')"
            prop="goodsNumInBox"
          >
            <el-input-number
              :step="1"
              :precision="0"
              :min="0"
              v-model="goodsNumBoxForm.goodsNumInBox"
            >
            </el-input-number>
          </el-form-item>
        </el-form>
      </div>
      <div class="footer" >
        <el-button @click="goodsNumBoxFormDialog = false" class="mgb10">{{$t('common.cancel')}}</el-button>
        <el-button @click="confirmGoodsNum" :loading="goodsNumBoxFormLoading" type="primary">{{$t('common.confirm')}}</el-button>
      </div>
    </el-dialog>

    <el-dialog
      class="label-pdf-dialog"
      :title="$t('stock.上传官方SKU标')"
      :visible.sync="labelPdfDialog"
      width="850px"
    >
      <div class="" style="margin-top: -20px">
        <div class="mgb10">
          {{ $t('stock.官方标提示语1') }}
        </div>
        <el-table
          :border="true"
          :data="labelPdfData"
        >
          <el-table-column
            prop="goodsId"
            :label="$t('table.ListingIDAndSKU')"
            show-overflow-tooltip
            min-width="300px"
          >
            <template slot-scope="{row}">
              {{row.goodsId}}{{row.sku ? `(${row.sku})` : ''}}
            </template>
          </el-table-column>
          <m-l-code-column></m-l-code-column>
          <el-table-column
            prop="platform"
            :label="$t('table.platform')"
            width="120px"
          >
            <template slot-scope="{row}">
              {{getPlatformShortNameByAccountNum(row.accountTypeNum)}}({{row.showName}})
            </template>
          </el-table-column>
          <el-table-column
            prop="operate"
            :label="$t('table.operate')"
            width="150px"
          >
            <template slot-scope="{row}">
              <upload-goods-label
                :id="row.id"
                :file="row.labelPdf"
                :data-obj="row"
              ></upload-goods-label>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-dialog>
  </div>
</template>

<script>

import {
  deleteStock,
  getFullGoodsList,
  saveStockPackageMaterialId, saveSuitGoodsIsCombination,
  setGoodsNumInBox,
  stockList,
  suitStockGoods
} from "@/api/stock";
import {
  deepCopy,
  getFalabellaName,
  getMercadoName,
  getAmazonName,
  getPlatformShortNameByAccountNum,
  getPlatformTextColor,
  getShopeeName,
  getSheinName,
  getTikTokName,
  getAliexpressName,
} from "@/utils";
import {getGoodsList, getSuitGoodsList, sheinGoodsCollectIsDone, syncSheinGoods} from "@/api/goods";
import ExportButton from "@/views/order/components/ExportButton.vue";
import {getAllAccountList} from "@/api/account";
import AccountCheckbox from "@/views/stock/components/AccountCheckbox.vue";
import {getWareHouseName} from "@/utils/common";
import PrintSkuInfo from "@/views/stock/components/PrintSkuInfo.vue";
import UploadGoodsLabel from "@/views/stock/components/UploadGoodsLabel.vue";
import FullSpan from "@/views/stock/components/FullSpan.vue";
import MLCodeColumn from "@/views/stock/components/MLCodeColumn.vue";
import MLCodeListColumn from "@/views/stock/components/MLCodeListColumn.vue";
import PacketGoodsTable from "@/views/stock/components/packetGoodsTable.vue";
import GoodsValueColumn from "@/views/stock/components/GoodsValueColumn.vue";
import {STOCK_FIELDS_CONFIG} from "@/views/stock/config/fieldsConfig";
import stockListMixin from "@/views/stock/mixin/stockListMixin";
import CustomFieldsDialog from "@/components/Common/CustomFieldsDialog.vue";
import GoodsValueColumnV2 from "@/views/stock/components/GoodsValueColumnV2.vue";
import GoodsSizeV2 from "@/views/stock/components/GoodsSizeV2.vue";
import StockNum from "@/views/stock/components/StockNum.vue";
import GoodsSize from "@/views/stock/components/GoodsSize.vue";
import BatchGoodsAttr from "@/views/stock/components/BatchGoodsAttr.vue";
import StockLogDialog from "@/views/stock/components/StockLogDialog.vue";
import CombinationGoods from "@/views/stock/components/CombinationGoods.vue";
import FlexSpan from "@/views/stock/components/FlexSpan";

import {
  getRoleName,
  getRoleTypeName,
  ROLE_OPERATE,
  ROLE_FINANCE,
  ROLE_DATA_STATISTICS,
  ROLE_PACKAGE_MANAGEMENT,
  ROLE_INVENTORY_MANAGEMENT,
  ROLE_ACCOUNT_MANAGEMENT,
} from '@/utils/user';
import checkPermission from "@/utils/permission";
import EditGoodsAttr from "@/views/stock/components/EditGoodsAttr.vue";
import goodsOptionsMixin from "@/views/stock/mixin/goodsOptionsMixin";
import warehouseListMixin from "@/views/stock/mixin/warehouseListMixin";

export default {
  name: "stockList",
  mixins: [
    stockListMixin,
    goodsOptionsMixin,
    warehouseListMixin,
  ],
  components: {
    EditGoodsAttr,
    FlexSpan,
    StockLogDialog,
    CombinationGoods,
    BatchGoodsAttr,
    PacketGoodsTable,
    GoodsSize,
    StockNum,
    GoodsSizeV2,
    GoodsValueColumnV2,
    CustomFieldsDialog,
    MLCodeColumn,
    MLCodeListColumn,
    FullSpan,
    ExportButton,
    PrintSkuInfo,
    UploadGoodsLabel,
  },
  data(){
    return {
      loading: false,
      queryParams: {
        page: 1,
        pageSize: 10,
        keyword: '',
        accountIds: [-1],
        tabType: 1,
        platformType: '',
        isPackageMaterial: '',
        orderBy: '',
        orderField: '',
        exportType: 'user_stock_list',
        inventoryTips: 0,
        faInventoryTips: 0,
        spInventoryTips: 0,
        siInventoryTips: 0,
        awsInventoryTips: 0,
        tiktokInventoryTips: 0,
        aliexpressInventoryTips: 0,
        stockTips: 0,
        isCombinationGoods: '',
        accountId: '',
        haveStock: '',
      },
      inventoryTipsNum: 0,
      faInventoryTipsNum: 0,
      spInventoryTipsNum: 0,
      siInventoryTipsNum: 0,
      awsInventoryTipsNum: 0,
      tiktokInventoryTipsNum: 0,
      aliexpressInventoryTipsNum: 0,
      stockTipsNum: 0,
      isOpenCombinationGoods: 0,
      selectAccountList: [],
      accountList: [],
      data: [],
      fullData : [],
      total: 0,
      dialogSuit : false,
      isIndeterminate: true,
      suitData:[],
      selectGoods:[], // 当前已选择的关联商品
      goodsTableLoading: false,
      suitParams:{
        page: 1,
        pageSize: 30,
        keyword: '',
        isWarehouse: 1,
        accountType: '',
        suitId: '',
      },
      rowId : '', // 当前选择的编辑
      rowIsWarehouse: 1,
      suitConfirmLoading: false, // 提交loading
      stockList,
      packageMaterial: [],
      goodsNumBoxForm: {
        id: '',
        goodsNumInBox: 0,
      }, // 箱装数表单
      goodsNumBoxFormDialog: false, // 箱装数dialog
      goodsNumBoxFormLoading: false, // 箱装数loading
      labelPdfData: [], // sku标
      labelPdfDialog: false, // dialog
      sheinTimer: null,
    }
  },
  created() {
    // this.setQueryParams()
    this.firstGetData()
  },
  updated () {
    this.$nextTick(() => {
      this.$refs['tableDataOne'].doLayout();
      this.$refs['tableDataTwo'].doLayout();
    })
  },
  methods:{
     checkPermission,
    getPlatformTextColor,
    getShopeeName,
    getSheinName,
    getPlatformShortNameByAccountNum,
    getFalabellaName,
    getAmazonName,
    getMercadoName,
    getWareHouseName,
    getFullGoodsList,
    getTikTokName,
    getAliexpressName,
    gotoEditPacketGoods(row) {
      this.$router.push({
        name: 'updatePacketGoods',
        params: {
          goodsId: row.goodsId,
        },
      });
    },
    ROLE_FINANCE() {
      return ROLE_FINANCE
    },
    firstGetData(){
      this.getUserFields(STOCK_FIELDS_CONFIG)
        .then(res=>{
          this.createTableFieldsConfig()
          this.getData()
        })
        .catch(()=>{
          this.getData()
        })
    },
    // 获取表单数据
    getData(){
      this.loading = true
      if(this.queryParams.tabType === 1){
        stockList(this.queryParams)
          .then(res=>{
            this.loading = false
            this.data = res.data.map(item=>{
              item.editGoodsValueStatus = 0
              return item
            })
            this.total = res.info.total
            this.packageMaterial = res.info.packageMaterial
            this.inventoryTipsNum = res.info.tipsNumInfo.inventoryTipsNum
            this.faInventoryTipsNum = res.info.tipsNumInfo.faInventoryTipsNum
            this.spInventoryTipsNum = res.info.tipsNumInfo.spInventoryTipsNum
            this.siInventoryTipsNum = res.info.tipsNumInfo.siInventoryTipsNum
            this.awsInventoryTipsNum = res.info.tipsNumInfo.awsInventoryTipsNum
            this.tiktokInventoryTipsNum = res.info.tipsNumInfo.tiktokInventoryTipsNum
            this.aliexpressInventoryTipsNum = res.info.tipsNumInfo.aliexpressInventoryTipsNum
            this.stockTipsNum = res.info.tipsNumInfo.stockTipsNum
            this.isOpenCombinationGoods = res.info.isOpenCombinationGoods
            this.selectAccountList = res.info.selectAccountList
          })
      }else{
        stockList(this.queryParams)
          .then(res=>{
            this.loading = false;
            this.fullData = deepCopy(res.data)
            this.total = res.info.total
            this.packageMaterial = res.info.packageMaterial
            this.inventoryTipsNum = res.info.tipsNumInfo.inventoryTipsNum
            this.faInventoryTipsNum = res.info.tipsNumInfo.faInventoryTipsNum
            this.spInventoryTipsNum = res.info.tipsNumInfo.spInventoryTipsNum
            this.siInventoryTipsNum = res.info.tipsNumInfo.siInventoryTipsNum
            this.awsInventoryTipsNum = res.info.tipsNumInfo.awsInventoryTipsNum
            this.tiktokInventoryTipsNum = res.info.tipsNumInfo.tiktokInventoryTipsNum
            this.aliexpressInventoryTipsNum = res.info.tipsNumInfo.aliexpressInventoryTipsNum
            this.stockTipsNum = res.info.tipsNumInfo.stockTipsNum
          })
      }

    },
    // 搜索表格数据
    search(){
      this.queryParams.page = 1;
      this.getData()
    },
    // 添加库存按钮事件
    addStock(){
      // 跳转到添加页面
      this.$router.push({
        name: 'addStock'
      })
    },
    // 编辑适用的商品
    suitGoods(row){
      this.selectGoods = [];
      this.selectGoods.push(...row.goodsList.filter(item => item.isGoods))
      this.suitData = [];
      this.rowId = row.suitId;
      this.rowIsWarehouse = row.isWarehouse;
      this.suitParams.keyword = ''
      this.suitParams.accountType = row.accountType
      this.suitParams.isWarehouse = row.isWarehouse
      // this.suitParams.suitId = row.suitId;
      this.dialogSuit = true;
    },
    // 获取商品的列表
    getSuitData(){
      this.goodsTableLoading = true
      getSuitGoodsList(this.suitParams)
        .then(res=>{
          this.goodsTableLoading = false
          const { data, info } = res
          this.suitData = deepCopy(data)

        })
    },
    // 移除选择的商品
    removeSelect(row){
      this.selectGoods = this.selectGoods.filter(item => item.id !== row.id)
    },
    // 已选择过的 不能再选择
    disAbleAdd(row){
      if(row.suitId > 0 && row.suitId === this.rowId){
        return true;
      }
      if(row.stockNum > 0){
        return true;
      }

      let flag = this.selectGoods.find(item=>{
        if(item.id === row.id){
          return true;
        }
      })
      return !!flag;
    },
    // 添加商品
    addSelectGoods(row) {
      this.selectGoods.push(row)
    },
    deleteStock(row){
      this.$confirm('确定删除该库存吗？', {
        confirmButtonText: this.$t('common.confirm'),
        cancelButtonText: this.$t('common.cancel'),
        type: 'warning'
      })
        .then(()=>{
          deleteStock(row.id)
            .then(res=>{
              this.$successMessage(res.message)
              this.getData()
            })
        })
        .catch(err => { console.error(err) })

    },
    //
    confirmSuit(){
      const postData = {
        suitId: this.rowId,
        isWarehouse : this.rowIsWarehouse,
        suitGoods: deepCopy(this.selectGoods)
      }
      this.suitConfirmLoading = true;
      suitStockGoods(postData)
        .then(res=>{
          this.suitConfirmLoading = false;
          this.dialogSuit = false; // 关闭窗口
          this.$successMessage(this.$t('common.successful'));
          this.getData()
        })
    },

    savePackageMaterialId(row){
      const postData = {
        id: row.id,
        packageMaterialId : row.packageMaterialId,
      }
      this.loading = true;
      saveStockPackageMaterialId(postData)
        .then(res=>{
          this.loading = false;
          if(res.error === 0){
            this.$successMessage(res.message)
          }else{
            this.$errorMessage(res.message)
          }
        })
    },
    packagingTableAction(h, { column }) {
      const content = this.$t('table.Packaging Tis One');
      return h('div', [
        h('span', column.label),
        h(
          'el-tooltip',
          {
            props: {
              effect: 'dark',
              content: content,
              placement: 'right',
            },
          },
          [
            h('i', {
              class: 'el-icon-question',
              style: 'color:#409eff;margin-left:5px;',
            }),
          ]
        ),
      ])
    },
    // 修改箱装数
    showGoodsNumBoxDialog(row){
      this.goodsNumBoxForm.id = row.id
      this.goodsNumBoxForm.goodsNumInBox = row.goodsNumInBox
      this.goodsNumBoxFormDialog = true
    },
    // 提交箱装数
    confirmGoodsNum(){
      if(!this.goodsNumBoxForm.goodsNumInBox){
        this.$errorMessage(this.$t('stock.箱装数请填写大于0的数字'))
        return;
      }
      this.goodsNumBoxFormLoading = true
      setGoodsNumInBox(this.goodsNumBoxForm)
        .then(res=>{
          this.goodsNumBoxFormLoading = false
          if(res.error === 0){
            this.goodsNumBoxFormDialog = false
            this.getData()
          }else{
            this.$errorMessage(res.message)
          }
        })
    },
    // 上传官方sku标
    showLabelPdfDialog(row){
      this.labelPdfDialog = true
      this.labelPdfData = row.goodsList.filter(item=> item.isGoods)
    },
    editGoodsValue(row){
      this.goodsForm.id = row.id
      this.goodsForm.goodsValue = row.goodsValue
      row.editGoodsValueStatus = 1
      this.$nextTick(()=>{
        this.$refs.goodsValueInput.focus()
      })
    },
    submitGoodsValue(row){

    },
    handleSortChange(column){
      this.queryParams.orderBy = '';
      this.queryParams.orderField = '';
      if(column.order){
        this.queryParams.orderBy = column.order;
        this.queryParams.orderField = column.prop
      }
      this.search()
    },
    submitTableField(selectedFields){
      this.loading = true;
      this.setUserFields(STOCK_FIELDS_CONFIG, selectedFields)
        .then(() => {
          this.loading = false;
          this.userSelectedFields = selectedFields;
          this.createTableFieldsConfig();

          // 字段更新排序，列排序不会发生变化
          // 这里强制刷新表格
          this.refreshTableKey++;
        })
        .catch(() => {
          this.loading = false;
          this.$message.error("保存失败, 请稍后再试");
        });
    },
    changeCombination(row){
      saveSuitGoodsIsCombination({
        id: row.id,
        isCombination: row.isCombination,
      })
        .then(res=>{
          this.$successMessage(res.message)
        })
    },
    // 同步希音商品
    syncSheinGoods(){
      syncSheinGoods()
        .then(res=>{
          this.createTimer(); // 无论成功失败都创建定时器
          if(res.error === 0){
            this.$successMessage(res.message)
          }else{
            this.$errorMessage(res.message)
          }
        })
    },
    createTimer(){
      if(this.sheinTimer){
        return;
      }
      this.sheinTimer = setInterval(()=>{
        sheinGoodsCollectIsDone()
          .then(res=>{
            if(res.data.isDone){
              this.$router.go(0)
            }
          })
      },3000);
    },

    changeButton(field){
      switch (field){
        case 'inventory':
          this.queryParams.inventoryTips = this.queryParams.inventoryTips === 1 ? 0 : 1;
          break;
        case 'stock':
          this.queryParams.stockTips = this.queryParams.stockTips === 1 ? 0 : 1;
          break;
        case 'faInventory':
          this.queryParams.faInventoryTips = this.queryParams.faInventoryTips === 1 ? 0 : 1;
          break;
        case 'spInventory':
          this.queryParams.spInventoryTips = this.queryParams.spInventoryTips === 1 ? 0 : 1;
          break;
        case 'siInventory':
          this.queryParams.siInventoryTips = this.queryParams.siInventoryTips === 1 ? 0 : 1;
          break;
        case 'awsInventory':
          this.queryParams.awsInventoryTips = this.queryParams.awsInventoryTips === 1 ? 0 : 1;
          break;
        case 'tiktokInventory':
          this.queryParams.tiktokInventoryTips = this.queryParams.tiktokInventoryTips === 1 ? 0 : 1;
          break;
        case 'aliexpressInventory':
          this.queryParams.aliexpressInventoryTips = this.queryParams.aliexpressInventoryTips === 1 ? 0 : 1;
          break;
      }
      this.search()
    },

    inventoryTipsClass(row){
      let flag = false
      switch (row.accountTypeNum){
        case 1:
          flag = row.inventory < this.inventoryTipsNum
          break;
        case 2:
          flag = row.inventory < this.faInventoryTipsNum
          break;
        case 3:
          flag = row.inventory < this.spInventoryTipsNum
          break;
        case 4:
          flag = row.inventory < this.siInventoryTipsNum
          break;
        case 5:
          flag = row.inventory < this.awsInventoryTipsNum
          break;
        case 6:
          flag = row.inventory < this.tiktokInventoryTipsNum
          break;
        case 8:
          flag = row.inventory < this.aliexpressInventoryTipsNum
          break;
      }
      return {
        'font-red': flag
      }
    },
    jumpStockInfo(row){
      // 跳转到添加页面
      const { href } = this.$router.resolve({
        name: 'stockInfo',
        query:{
          id: row.id,
        }
      })
      window.open(href,'_blank')
    },
  },
  // 清除定时器
  beforeDestroy() {
    if (this.sheinTimer) {
      clearInterval(this.sheinTimer)
    }
  },
}
</script>
<style lang="scss">
.goods-table{
  .el-table__expand-icon {
    float: left;
    line-height: 100px;
    height: 100px;
    font-size: 14px;
    position: absolute;
    top: 30px;
    left: 5px;
  }
}
</style>

<style scoped lang="less">
.wrap {
  padding: 30px 30px;
  .header{

  }
  .content{
    padding: 20px 0 0;
  }
}

</style>

<style lang="less">
.channel-form{
  &.el-form{
    .el-form-item__label{
      word-break: break-word;
    }
  }
}
.channel-box-card{
  .el-card__header{
    padding: 5px 10px;
    font-size: 12px;
    line-height: 26px;
  }
  .el-card__body{
    padding: 0;
  }
}
.query-select{
  margin-right: 20px;
}
.select-goods-dialog{
  .footer{
    margin-top: 30px;
    display: flex;
    justify-content: flex-end;
  }
}
.full-tag{
  position: absolute;
  top: 0;
  left: 0;
}
.select-goods-dialog{
  .catalogo-tag{
    background-color: #5c5c5c;
    color: #ffffff;
    width: auto;
    padding: 1px 2px;
    font-size: 10px;
    font-weight: bold;
    position: absolute;
    top: 0;
    left: 0;
  }
}
.goods-num-box-dialog{
  .footer{
    display: flex;
    justify-content: flex-end;
  }
}
.line-block{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.order-status-tag{
  font-weight: bold;
}
.img-tag{
  position: absolute;
  top: 0;
  left: 0;
}
.btn-more-box{
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: flex-start;
  .btn-item{
    margin: 5px 0;
  }
}
</style>
